// proxyIncome.js
import * as echarts from '../../miniprogram_npm/ec-canvas/echarts';
import Toast from '../../miniprogram_npm/@vant/weapp/toast/toast';

const app = getApp()
const util = require("../../utils/util.js")
var lineChart = null;

Page({

  /**
   * 页面的初始数据
   */
  data: {
    userType:'agent',
    income:{},
    eclineYesterday: {
      // onInit: initGaugeChart,
      lazyLoad: true
    },
    ecline: {
      // onInit: initGaugeChart,
      lazyLoad: true
    },
    eclineThirty: {
      // onInit: initGaugeChart,
      lazyLoad: true
    },
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      userType: options.userType
    })
    this.lineechartsComponnet = this.selectComponent('#mychart-dom-line');
    this.lineechartsComponnetYes = this.selectComponent('#mychart-dom-line-yesterday');
    this.lineechartsComponnetThirty = this.selectComponent('#mychart-dom-line-thirty');
    this.useList();
  },
  onUnload: function () {
    lineChart = null;
  },
  incomeDetail:function(){
    var userType = this.data.userType;
    if(userType == "agent"){
      wx.navigateTo({
        url: '../../pages/proxyIncomeDetail/proxyIncomeDetail',
      })
    } else if (userType == "shop") {
      wx.navigateTo({
        url: '../../pages/merchantOrder/merchantOrder',
      })
    }
    
  },
  tipIcon:function(e){
    var that = this;
    var mess = e.currentTarget.dataset.mess;
    Toast(mess);
  },
  useList: function () {
    var that = this;
    var type = that.data.userType == "agent" ? "agent":"shop";
    var data = {
      type: type
    };
    app.post('identity/income', data).then((res) => {
      if (res.code == 200) {
        that.setData({
          income:res.data
        })
        lineChart = null;
        if (that.data.order !== null || that.data.order.length !== 0) {
          if (!lineChart) {
            this.initLineChart()
          } else {
            this.setOptionLine(lineChart)
            this.setOptionLineYesterday(lineChart)
            this.setOptionLineThirty(lineChart)

          }
        }
      }
    }).catch((errMsg) => {
      console.log(errMsg);
      wx.showToast({
        title: "网络错误",
        icon: 'loading',
        duration: 2000
      })
    })
  },
  // 订单数折线图建立
  // 初始化
  initLineChart: function () {
    this.lineechartsComponnet.init((canvas, width, height) => {
      lineChart = echarts.init(canvas, null, {
        width: width,
        height: height
      });
      // Chart.setOption(this.getOption());
      this.setOptionLine(lineChart);
      // 注意这里一定要返回 chart 实例，否则会影响事件处理等
      return lineChart;
    });
    this.lineechartsComponnetYes.init((canvas, width, height) => {
      lineChart = echarts.init(canvas, null, {
        width: width,
        height: height
      });
      this.setOptionLineYesterday(lineChart);
      return lineChart;
    });
    this.lineechartsComponnetThirty.init((canvas, width, height) => {
      lineChart = echarts.init(canvas, null, {
        width: width,
        height: height
      });
      this.setOptionLineThirty(lineChart);
      return lineChart;
    });
  },
  // 七天
  setOptionLine: function (Chart) {
    var that = this;
    var order = that.data.income.chart;
    var total = '金额：' + that.data.income.sevenProfit.toFixed(2)+'元';
    var date = [];
    var num = [];
    for (var i = 0; i < order.length; i++) {
      date.push(order[i].click_date);
      num.push(order[i].amount)
    }
    Chart.clear();  // 清除
    Chart.setOption(this.getLine(total,date,num), true);  //获取新数据
  },
  // 昨天
  setOptionLineYesterday: function (Chart) {
    var that = this;
    var order = that.data.income.yesterdayList;
    var total = '金额：' + that.data.income.yesterday.toFixed(2) + '元';
    var date = [];
    var num = [];
    for (var i = 0; i < order.length; i++) {
      date.push(order[i].hours);
      num.push(order[i].amount)
    }
    Chart.clear();  // 清除
    Chart.setOption(this.getLine(total, date, num), true);  //获取新数据
  },
  // 30天
  setOptionLineThirty: function (Chart) {
    var that = this;
    var order = that.data.income.monthList;
    var total = '金额：' + that.data.income.thirtyProfit.toFixed(2) + '元';
    var date = [];
    var num = [];
    for (var i = 0; i < order.length; i++) {
      date.push(order[i].date);
      num.push(order[i].amount)
    }
    Chart.clear();  // 清除
    Chart.setOption(this.getLine(total, date, num), true);  //获取新数据
  },
  // 参数
  getLine: function (total,date,num) {
    var option = {
      color: ["#f08519"],
      title:{
        text:total,
        textStyle:{
          color :'#808080',
          fontSize :14
        },
        top :10,
        left:20
      },
      tooltip: {//提示框
        show: true,
        trigger: 'axis',
        formatter: '收益金额:￥{c}',
        axisPointer:{
          // type :'none'
          type: 'cross',
          axis :'x',
          snap :true,
          animation: false,
          label: {
            backgroundColor: '#505765'
          }
        },
        showContent: false,
      },
      grid: {
        x: '0%', y: '25%', width: '92%', height: '70%', containLabel: true
      },
      xAxis: {
        position: "bottom",
        type: 'category',
        boundaryGap: false,
        min: 'dataMin',
        data: date,
        axisLine: {
          show: false
        },
        axisTick: {
          show: false
        },
        nameTextStyle :{
          fontSize :18,
          align:'center'
        }
      },
      yAxis: {
        show: false
      },
      // dataZoom: [
      //   {
      //     type: 'inside',
      //     start: 0,
      //     end: 100
      //   }
      // ],
      series: [{
        name: '收益金额',
        type: 'line',
        smooth: true,
        data: num,
        clipOverflow: false,
        showSymbol: false,
        symbolSize: 6,
        // sampling: 'average',
        itemStyle: {
          normal: {
            borderWidth: 2
          }
        },
        label: {
          normal : {
            show: true,
            position: 'top',
            formatter :'￥{c}',
            fontSize :18,
          }
        },
        areaStyle: {
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            offset: 0,
            color: 'rgba(240, 133, 25,.3)'
          }, {
            offset: 1,
            color: 'rgba(240, 133, 25,0)'
          }]),
        },
      }]
    };
    return option;
  }
})